<template>
  <div>
    <el-dialog
      @close="cancel"
      title="详情"
      :visible.sync="open"
      width="1000px"
      append-to-body
    >
      <el-form
        ref="elForm"
        disabled
        :model="formData"
        :rules="rules"
        size="medium"
        label-width="120px"
      >
        <h2 style="text-align: center">标准</h2>
        <h4 class="form-header h4">基本信息</h4>
        <el-row :gutter="15">
          <el-col :span="8">
            <el-form-item label="文件关键字" prop="keyword">
              <el-input
                v-model="formData.keyword"
                placeholder="请输入文件关键字"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标准名称" prop="standardName">
              <el-input
                v-model="formData.standardName"
                placeholder="请输入标准名称"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="代号及年代号" prop="standardCode">
              <el-input
                v-model="formData.standardCode"
                placeholder="请输入代号及年代号"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="替代情况" prop="replaceInfo">
              <el-input
                v-model="formData.replaceInfo"
                placeholder="请输入替代情况"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="标准级别" prop="levelValue">
              <el-select
                v-model="formData.levelValue"
                placeholder="请选择标准级别"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_standard_level"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="标准领域" prop="domainValue">
              <el-select
                v-model="formData.domainValue"
                placeholder="请选择标准领域"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_standard_area"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标准性质" prop="natureValue">
              <el-select
                v-model="formData.natureValue"
                placeholder="请选择标准性质"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_standard_nature"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标准内容" prop="contentValue">
              <el-select
                v-model="formData.contentValue"
                placeholder="请选择标准性质"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_standard_content"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="有效性" prop="effectValue">
              <el-select
                v-model="formData.effectValue"
                placeholder="请选择有效性"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_availability_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计量状态" prop="calculateValue">
              <el-select
                v-model="formData.calculateValue"
                placeholder="请选择计量状态"
                clearable
                :style="{ width: '100%' }"
              >
                <el-option
                  v-for="dict in dict.type.sys_metering_status"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="发布日期" prop="pushDate">
              <el-date-picker
                v-model="formData.pushDate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :style="{ width: '100%' }"
                placeholder="请选择发布日期"
                clearable
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="宣贯日期" prop="publicityDate">
              <el-date-picker
                v-model="formData.publicityDate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :style="{ width: '100%' }"
                placeholder="请选择宣贯日期"
                clearable
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="入库时间" prop="inDate">
              <el-date-picker
                v-model="formData.inDate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :style="{ width: '100%' }"
                placeholder="请选择入库时间"
                clearable
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="总数量" prop="totalNum">
              <el-input-number
                :style="{ width: '100%' }"
                v-model="formData.totalNum"
                placeholder="总数量"
                :step="1"
                controls-position="right"
              >
              </el-input-number>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="当前库存数量" prop="currentNum">
              <el-input-number
                :style="{ width: '100%' }"
                v-model="formData.currentNum"
                placeholder="当前库存数量"
                :step="1"
                controls-position="right"
              >
              </el-input-number>
            </el-form-item>
          </el-col>
        </el-row>
        <h4 class="form-header h4">附件信息</h4>
        <el-form-item label="" prop="fileUrl" style="position: relative">
          <!-- <img
            src="@/assets/images/watermark.png"
            style="width: 200px; position: absolute"
            :style="{
              top: Math.random() * 45 - 30 + 'px',
              right: Math.random() * 90 + 30 + 'px',
              transform:
                'rotate(' + Math.abs(Math.random() * 45 - 360) + 'deg)',
            }"
          /> -->
          <FileUpload :isDelete="false" v-model="formData.fileUrl"></FileUpload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  standardAdd,
  updategStandard,
  standardInfo,
} from "@/api/system/standard.js";
import { listSelect } from "@/api/business/project.js";
export default {
  dicts: [
    "sys_standard_level",
    "sys_standard_area",
    "sys_standard_nature",
    "sys_standard_content",
    "sys_metering_status",
    "sys_availability_type",
  ],

  props: {
    open: false,
    rowDetail: {},
    title: "",
    formData: {},
    disabled: false,
  },
  data() {
    return {
      formData: {
        fileCode: undefined,
        userId: undefined,
        levelValue: undefined,
        standardName: undefined,
        domainValue: undefined,
        natureValue: undefined,
        contentValue: undefined,
        effectValue: undefined,
        calculateValue: undefined,

        isApplyValue: undefined,
        pushDate: null,
        publicityDate: null,
        inDate: null,
        keyword: "",
        currentNum: undefined,
        replaceInfo: "",
        standardCode: "",
        totalNum: undefined,
      },
      rules: {
        fileCode: [
          {
            required: true,
            message: "请输入受控编号",
            trigger: "blur",
          },
        ],
        keyword: [
          {
            required: false,
            message: "请输入关键字",
            trigger: "change",
          },
        ],
        levelValue: [
          {
            required: true,
            message: "请选择文件类型",
            trigger: "change",
          },
        ],
        fileUrl: [
          {
            required: true,
            message: "附件不能为空",
            trigger: "change",
          },
        ],
        standardName: [
          {
            required: true,
            message: "请输入标准名称",
            trigger: "blur",
          },
        ],
        domainValue: [
          {
            required: true,
            message: "请选择标准领域",
            trigger: "change",
          },
        ],
        natureValue: [
          {
            required: true,
            message: "请选择标准性质",
            trigger: "change",
          },
        ],
        contentValue: [
          {
            required: true,
            message: "请选择标准内容",
            trigger: "change",
          },
        ],
        effectValue: [
          {
            required: true,
            message: "请选择有效值",
            trigger: "change",
          },
        ],
        calculateValue: [
          {
            required: true,
            message: "请选择计量状态",
            trigger: "change",
          },
        ],
        pushDate: [
          {
            required: true,
            message: "请选择发布日期",
            trigger: "change",
          },
        ],
        publicityDate: [
          {
            required: true,
            message: "请选择宣贯日期",
            trigger: "change",
          },
        ],
        inDate: [
          {
            required: true,
            message: "请选择入库日期",
            trigger: "change",
          },
        ],
        totalNum: [
          {
            required: true,
            message: "总数量",
            trigger: "blur",
          },
        ],
        currentNum: [
          {
            required: true,
            message: "当前库存数量",
            trigger: "blur",
          },
        ],
        replaceInfo: [
          {
            required: true,
            message: "替代情况",
            trigger: "blur",
          },
        ],
        standardCode: [
          {
            required: true,
            message: "代号及年代号",
            trigger: "blur",
          },
        ],
      },
    };
  },
  mounted() {},
  methods: {
    show(id) {
      this.open = true;
      this.getinfo(id);
    },
    cancel() {
      this.open = false;
      this.$emit("update:open");
      this.$emit("cancel");
    },
    getinfo(id) {
      standardInfo(id).then((response) => {
        this.formData = response.data;
      });
    },
  },
};
</script>
